<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>archive-website</title>
	<meta name="description" content="Made by RainPPR">
	<meta name="author" content="RainPPR">
	<meta property="og:title" content="archive-website">
	<meta property="og:description" content="Made by RainPPR">
	<meta property="og:image" content="images/favicon-64.png">
	<meta name="twitter:card" content="summary">
	<meta name="twitter:title" content="archive-website">
	<meta name="twitter:description" content="Made by RainPPR">
	<meta name="twitter:image" content="images/favicon-64.png">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link href="images/favicon%2d16.png" rel="icon" sizes="16x16" type="image/png">
	<link href="images/favicon%2d32.png" rel="icon" sizes="32x32" type="image/png">
	<link href="images/favicon%2d64.png" rel="icon" sizes="64x64" type="image/png">
	<link href="images/favicon-180.png" rel="apple-touch-icon" sizes="180x180">
	<link href="images/favicon-167.png" rel="apple-touch-icon" sizes="167x167">
	<link href="images/favicon-152.png" rel="apple-touch-icon" sizes="152x152">
	<link href="images/favicon-64.png" rel="apple-touch-icon" sizes="64x64">
	<link href="images/favicon-32.png" rel="apple-touch-icon" sizes="32x32">
	<link href="images/favicon-16.png" rel="apple-touch-icon" sizes="16x16">
	<link href="css/archive-website.css?v=2" rel="stylesheet">
	<link href="css/index.css?v=2" rel="stylesheet">
	<script src="js/bootstrap.min.js"></script>
	<script>	
		document.addEventListener('DOMContentLoaded', function(event)
		{
			var Toast1 = document.getElementById('Toast1');
			var bsToast1 = new bootstrap.Toast(Toast1, {animation: true, autohide: true, delay: 10000});
			setTimeout(function(){ bsToast1.show(); }, 10);
		});
		function Number2Path(num) {
			return ('0000000' + num).slice(-8);
		}
		function jump() {
			let value = document.getElementById("Editbox1").value;
			let path = "0x" + Number2Path(value);
			setTimeout(() => {
				window.location.href = path;
			}, 500)
		}
		function surprise() {
			alert("DoubleClick!");
		}
	</script>
</head>
<body "return="" false;"="" onselectstart="return false">
	<div id="wb_LayoutGrid3">
		<div id="LayoutGrid3">
			<div class="row">
				<div class="col-1">
				</div>
				<div class="col-2">
					<div id="wb_Heading7" style="display:inline-block;width:100%;z-index:0;">
						<h1 id="Heading7">archive-website</h1>
					</div>
				</div>
				<div class="col-3">
				</div>
			</div>
		</div>
	</div>
	<div id="wb_LayoutGrid4">
		<div id="LayoutGrid4">
			<div class="row">
				<div class="col-1">
					<div id="wb_Heading1" style="display:inline-block;width:100%;z-index:1;">
						<h1 id="Heading1">H: 0x</h1>
					</div>
				</div>
				<div class="col-2">
					<input type="text" id="Editbox1" style="display:block;width:100%;height:30px;z-index:2;" name="Editbox1" value="" maxlength="8" spellcheck="false" placeholder="Input key value">
				</div>
				<div class="col-3">
					<a id="Button1" href="javascript:void(0)" onclick="jump();document.getElementById('Button1').innerHTML='Go...';return false;" onmouseover="document.getElementById('Button1').style['background-color']='#7C7C7C';return false;" onmouseout="document.getElementById('Button1').style['background-color'] = '#4F4F4F';return false;" style="display:inline-block;width:55px;height:30px;z-index:3;">Go!</a>
				</div>
				<div class="col-4">
				</div>
			</div>
		</div>
	</div>
	<div id="wb_LayoutGrid2">
		<div id="LayoutGrid2">
			<div class="row">
				<div class="col-1">
					<div id="wb_Card3" style="display:flex;width:100%;z-index:4;" class="card" ondblclick="surprise();return false;">
						<div id="Card3-card-body">
							<div id="Card3-card-item0">Excellent Example</div>
							<div id="Card3-card-item1">Made by RainPPR</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="wb_LayoutGrid6">
		<div id="LayoutGrid6">
			<div class="row">
				<div class="col-1">
					<div id="wb_Card2" style="display:flex;width:100%;z-index:5;" class="card">
						<div id="Card2-card-body">
							<div id="Card2-card-item0">First</div>
							<div id="Card2-card-item1">Description</div>
						</div>
					</div>
				</div>
				<div class="col-2">
					<div id="wb_Card4" style="display:flex;width:100%;z-index:6;" class="card">
						<div id="Card4-card-body">
							<div id="Card4-card-item0">Second</div>
							<div id="Card4-card-item1">Description</div>
						</div>
					</div>
				</div>
				<div class="col-3">
					<div id="wb_Card1" style="display:flex;width:100%;z-index:7;" class="card">
						<div id="Card1-card-body">
							<div id="Card1-card-item0">Third</div>
							<div id="Card1-card-item1">Description</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div aria-live="polite" aria-atomic="true" id="toasts">
		<div id="Toast1" class="toast hide" role="alert" aria-live="assertive" aria-atomic="true">
			<div class="toast-header">
				<strong>Notification</strong>
				<small class="text-muted">Close</small>
				<button type="button" class="close" data-bs-dismiss="toast" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
			</div>
			<div class="toast-body"><p>Enter the key value in the edit box labeled "Input key value".</p></div>
		</div>
	</div>
	</body>
</html>